Configurations

Configure Payment Links UI

Payment Links can currently only be configured via APIs. Dashboard-based configuration is under development and this section will be updated once available.

Available Configurations

UI Configurations

Payment Link UI can be configured at the business profile level, and this configuration is used when payment links are created under that profile. You can also override this by providing UI configurations during individual payment link creation.

Sample Configuration:

{
  "theme": "String", // Primary color of the payment link
  "logo": "String", // Logo displayed in the details section
  "seller_name": "String", // Merchant's name in the details section
  "transaction_details": [PaymentLinkTransactionDetails], // Dynamic merchant-related details for the UI
  "background_image": PaymentLinkBackgroundImageConfig, // Background image config for the details section
  "details_layout": "api_enums::PaymentLinkDetailsLayout", // Layout configuration for the details section
  "sdk_layout": "String", // Layout for the payment widget
  "display_sdk_only": true, // Show only the payment widget
  "enabled_saved_payment_method": true, // Show option to save payment methods (secure links only)
  "hide_card_nickname_field": true, // Hide the card nickname input field
  "show_card_form_by_default": true, // Show card form by default
  "payment_button_text": "String" // Custom text for the Pay button
}

UI Customization Options

Primary Color

Set the theme using a hex color code. Example: "#2167AE"

Merchant Logo

Display a custom logo in the details section. Example: https://vaultera switch.io/favicon.ico

Merchant Name

Customize the merchant’s display name. Example: "vaultera Switch Inc."

Dynamic Details

You can add a list of key-value pairs shown in the details section. Each item supports optional configuration for styling and ordering. Example:

[
  { "key": "Business Country", "value": "Germany" },
  {
    "key": "Policy Number",
    "value": "938478327648",
    "ui_configuration": {
      "is_key_bold": false,
      "is_value_bold": false,
      "position": 2
    }
  },
  { "key": "Product Name", "value": "Life Insurance Elite" }
]

Background Image

Customize the background image of the details section. Example:

{
  "url": "https://img.freepik.com/free-photo/abstract-blue-geometric-shapes-background_24972-1841.jpg",
  "position": "bottom",
  "size": "cover"
}

Layout Options

Details Section Layout

Select from predefined layouts like layout1, layout2, etc.

Contact support for custom layout additions.

SDK Layout

Configure the layout for the payment widget using available SDK layouts. Example: "accordion" or "tabs" Set display_sdk_only: true to show only the payment widget. Defaults to false.

Enable Saved Payment Methods

Show a checkbox to allow users to save their payment method (for secure links only). Set enabled_saved_payment_method: true.

Hide Card Nickname Field

Set hide_card_nickname_field: true to remove the nickname input for saved cards.

Show Card Form by Default

Set show_card_form_by_default: true to default the view to the card form when a payment link is opened.

Payment Button Text

Customize the call-to-action button. Example: "Proceed to Payment!"

Other Configurations (Business Profile Level Only)

{
  "domain_name": "String", // Custom domain for hosting links
  "business_specific_configs": { "style_id": PaymentLinkConfigRequest }, // Multiple UI styles
  "allowed_domains": ["domain1.com", "domain2.com"], // Domains where secure links can be embedded
  "branding_visibility": false // Show or hide Vaultera Switch branding
}

Domain Name

Set a custom domain for hosting payment links.

Must be enabled before use. See docs on [Custom Domain Setup].

Multiple Style IDs

Define multiple styles under a profile using style IDs. Example:

{
  "style1": {
    "theme": "#3B845E",
    "logo": "https://vaultera switch.io/favicon.ico",
    "seller_name": "vaultera Switch Inc.",
    "display_sdk_only": true
  },
  "style2": {
    "theme": "#B202FF",
    "logo": "https://i.pinimg.com/736x/4d/83/5c/4d835ca8aafbbb15f84d07d926fda473.jpg",
    "seller_name": "Shopping Store",
    "enabled_saved_payment_method": true
  }
}

Use the payment_link_config_id field when creating a payment link to apply a specific style.

Allowed Domains

List of trusted domains (used only for secure links) where payment links can be embedded in an iframe. Example: ["localhost:5500", "my.custom.domain.com"]

Branding Visibility

Control whether Vaultera Switch branding appears in the payment links.

true → Branding shown (default)
false → Branding hidden

Configure Payment Links via API (Business Profile Level)

Use the following API to set default configurations:

curl --location '{{BASE_URL}}/account/{{MERCHANT_ID}}/business_profile/{{PROFILE_ID}}' \
--header 'Content-Type: application/json' \
--header 'api-key: {{ADMIN_API_KEY}}' \
--data '{
  "payment_link_config": {
    "theme": "#4E6ADD",
    "logo": "https://vaultera switch.io/favicon.ico",
    "seller_name": "vaultera Switch Inc.",
    "sdk_layout": "accordion",
    "display_sdk_only": true,
    "enabled_saved_payment_method": true,
    "hide_card_nickname_field": true,
    "show_card_form_by_default": true,
    "payment_button_text": "Proceed to Payment!",
    "transaction_details": [
      {
        "key": "Policy Number",
        "value": "297472368473924",
        "ui_configuration": {
          "position": 5,
          "is_key_bold": true,
          "is_value_bold": true
        }
      }
    ],
    "business_specific_configs": {
      "style1": {
        "theme": "#3B845E",
        "logo": "https://vaultera switch.io/favicon.ico",
        "seller_name": "vaultera Switch Inc.",
        "display_sdk_only": true
      },
      "style2": {
        "theme": "#B202FF",
        "logo": "https://i.pinimg.com/736x/4d/83/5c/4d835ca8aafbbb15f84d07d926fda473.jpg",
        "seller_name": "Shopping Store",
        "enabled_saved_payment_method": true
      }
    },
    "allowed_domains": ["localhost:5500"],
    "domain_name": "my.custom.domain.com",
    "branding_visibility": false
  }
}'

Default Configuration Values

{
  "theme": "#212E46",
  "logo": "url/logo_image_name.png",
  "seller_name": "merchant_name",
  "transaction_details": null,
  "background_image": null,
  "details_layout": "layout1",
  "sdk_layout": "tabs",
  "display_sdk_only": false,
  "enabled_saved_payment_method": false,
  "hide_card_nickname_field": false,
  "show_card_form_by_default": true,
  "payment_button_text": "Pay Now"
}

About Vaultera

Use Cases

Explore Vaultera

Checklist for Production

Essentials

Configure Payment Links UI

Available Configurations

UI Configurations

Sample Configuration:

UI Customization Options

Primary Color

Merchant Logo

Merchant Name

Dynamic Details

Background Image

Layout Options

Details Section Layout

SDK Layout

Display Only the Payment Widget

Enable Saved Payment Methods

Hide Card Nickname Field

Show Card Form by Default

Payment Button Text

Other Configurations (Business Profile Level Only)

Domain Name

Multiple Style IDs

Allowed Domains

Branding Visibility

Configure Payment Links via API (Business Profile Level)

Default Configuration Values

​Configure Payment Links UI

​Available Configurations

​UI Configurations

​Sample Configuration:

​UI Customization Options

​Primary Color

​Merchant Logo

​Merchant Name

​Dynamic Details

​Background Image

​Layout Options

​Details Section Layout

​SDK Layout

​Display Only the Payment Widget

​Enable Saved Payment Methods

​Hide Card Nickname Field

​Show Card Form by Default

​Payment Button Text

​Other Configurations (Business Profile Level Only)

​Domain Name

​Multiple Style IDs

​Allowed Domains

​Branding Visibility

​Configure Payment Links via API (Business Profile Level)

​Default Configuration Values

Configure Payment Links UI

Available Configurations

UI Configurations

Sample Configuration:

UI Customization Options

Primary Color

Merchant Logo

Merchant Name

Dynamic Details

Background Image

Layout Options

Details Section Layout

SDK Layout

Display Only the Payment Widget

Enable Saved Payment Methods

Hide Card Nickname Field

Show Card Form by Default

Payment Button Text

Other Configurations (Business Profile Level Only)

Domain Name

Multiple Style IDs

Allowed Domains

Branding Visibility

Configure Payment Links via API (Business Profile Level)

Default Configuration Values